<template>
	<view class='main-container'>
		<view v-if="goods.length==0" style="width: 100%;line-height: 300upx;font-size: 24upx; text-align: center; height: 300upx;background-color: #ffffff;">还没发布过二手物品哦~~</view>
		<view class='detail' v-for="(item,index) in goods" :key="index" @longpress="setting(index,item.id,item.goodsPrice)">
			<image :src="getRealPath(item.goodsImgUrl)"></image>
			<view>
				<text style="max-width: 80%; overflow: hidden;
		white-space: nowrap;
		text-overflow: ellipsis;">{{item.goodsName}}</text>
				<text style='color:red;font-size:33upx;'>￥{{item.goodsPrice}}</text>
			</view>
			<image src='../../static/images/right.png' style='width:35upx;height:35upx;margin-right:30upx;'>

			</image>
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex';
	import utils from "../../static/js/utils.js"
	export default {
		data() {
			return {
				goods: []
			}
		},
		onLoad() {
			this.getGoods();
		},
		onShow() {
			if (this.goodsChange) {
				this.getGoods();
			}
		},
		computed: {
			...mapState(['user', 'goodsChange'])
		},
		methods: {
			getGoods() {
				let that = this;
				utils.get("market/usercenter", {
					userId: this.user.id
				}, function(data) {
					that.goods = data;
				});
			},
			getRealPath(path) {
				return utils.baseImgUrl + path;
			},
			setFlag(id) {
				let that = this;
				uni.showModal({
					title: '通知提醒',
					content: '是否已卖出此商品',
					showCancel: true,
					cancelText: '手滑了',
					confirmText: '设为卖出',
					success: res => {
						if (res.confirm) {
							utils.post("market/setflag", {
								userId: that.user.id,
								goodsId: id
							}, function(data) {
								utils.successToast("设置为卖出成功");
							})
						}
					},
					fail: () => {},
					complete: () => {}
				});
			},
			del(id, index) {
				let that = this;
				uni.showModal({
					title: '通知提醒',
					content: '是否删除该商品',
					showCancel: true,
					cancelText: '手滑了',
					confirmText: '删除',
					success: res => {
						if (res.confirm) {
							utils.post("market/delete", {
								userId: that.user.id,
								goodsId: id
							}, function(data) {
								that.goods.splice(index, 1)
								utils.successToast("删除成功");

							})
						}
					},
					fail: () => {},
					complete: () => {}
				});
			},
			setting(index, id, price) {
				let that = this;
				if (that.goods[index].flag == 0) {
					uni.showActionSheet({
						itemList: ['更改价格', '设为卖出', '删除商品'],
						success: res => {
							if (res.tapIndex == 0) {
								uni.navigateTo({
									url: 'updateprice?price=' + price + "&id=" + id,
									success: res => {},
									fail: () => {},
									complete: () => {}
								});
							} else if (res.tapIndex == 1) {
								that.setFlag(id);
								that.goods[index].flag = 1;
							} else if (res.tapIndex == 2) {
								that.del(id);
															}
						},
						itemColor: '#fa4dbe',
						fail: () => {},
						complete: () => {}
					});
				} else {
					uni.showActionSheet({
						itemList: ['删除商品'],
						success: res => {
							if (res.tapIndex == 0) {
								that.del(id, index);
							}
						},
						itemColor: '#fa4dbe',
						fail: () => {},
						complete: () => {}
					});
				}
			}
		}
	}
</script>

<style>
	page {
		background-color: #f7f7f7;
	}

	.main-container {
		width: 100%;
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding-bottom: 30upx;
	}

	.detail {
		width: 100%;
		display: flex;
		flex-direction: row;
		align-items: center;
		height: 180upx;
		justify-content: flex-start;
		background-color: white;
		box-shadow: inset 0px -1px 1px -1px #dcdcdc;
	}

	.detail image {
		width: 160upx;
		height: 160upx;
		margin-left: 20upx;
	}

	.detail view {
		display: flex;
		flex: 1;
		height: 160upx;
		margin-left: 40upx;
		flex-direction: column;
		justify-content: space-around;
		font-size: 30upx;
	}
</style>
